import { Cascader, Checkbox, DatePicker, Form, Input, InputNumber, Radio, Select } from "antd";
import Person from "../Person";
import dayjs from "dayjs";
const { Option } = Select
export default function FormItems({ item }) {
    return (
        <Form.Item name={item.dataIndex} label={item.title} rules={item.rules ? item.rules : []}>
            {item.isTime ?
                <DatePicker picker={item.isYear && 'year'} defaultValue={dayjs(new Date())} style={{ width: '100%' }} placeholder={'请输入' + item.title} size="large" /> :
                item.textarea ? <Input.TextArea rows={4} placeholder={'请输入' + item.title} size="large" />
                    : item.isRadio ? <Radio.Group name={item.dataIndex}>
                        {item.options.map(op => <Radio key={op.value} value={op.value}>{op.label}</Radio>)}
                    </Radio.Group> : item.isCheckbox ? <Checkbox.Group name={item.dataIndex} options={item.options}></Checkbox.Group>
                        : item.pwd ? <Input.Password autoComplete="" placeholder={'请输入' + item.title} size="large" /> : item.select ?
                            <Select options={item.options} showSearch={item.isSearch} size="large" placeholder={'请选择' + item.title}></Select> : item.person ?
                                <Select size="large" placeholder={'请选择' + item.title}>
                                    {item.options.map((item, index) => <Option value={item.value} key={item.value}>
                                        <Person text={item.label} index={index} />
                                    </Option>)}
                                </Select> :
                                item.area ? <Cascader options={item.options} size="large" placeholder={'请选择' + item.title} ></Cascader> :
                                    item.isMoney ? <InputNumber style={{ width: '100%' }} size="large" placeholder={'请选择' + item.title} formatter={(value) => `¥ ${value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')} /> :
                                        item.isSite ? <Input addonBefore={<Form.Item name={item.dataIndex + 'before'} noStyle initialValue="http://">
                                            <Select>
                                                <Option value="http://">http://</Option>
                                                <Option value="https://">https://</Option>
                                            </Select>
                                        </Form.Item>} addonAfter={<Form.Item name={item.dataIndex + 'after'} noStyle initialValue=".com">
                                            <Select>
                                                <Option value=".com">.com</Option>
                                                <Option value=".jp">.jp</Option>
                                                <Option value=".cn">.cn</Option>
                                                <Option value=".org">.org</Option>
                                            </Select>
                                        </Form.Item>} size="large" placeholder={'请输入' + item.title} /> :
                                            <Input placeholder={'请输入' + item.title} size="large" />}
        </Form.Item>
    )
}
